﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/mainLayout.cshtml";
}
<script>
    //show comment
    function showComment(postID) {
        $.ajax({
            type: "GET",
            url: "/Post/getComment",
            data: {postID: postID},
            success: function (resp) {
                var jsonData = '{"jsonData":' + resp + '}';
                var jsonParse = $.parseJSON(jsonData);
                
                var html = '';

                for (var i = 0; i < jsonParse.jsonData.length; i++) {
                    
                    if (jsonParse.jsonData[i]) {
                        var n = jsonParse.jsonData[i];

                        html += '          <!--start comment_item--> ' +
									'		<div class="comment_item"> ' +
									'			<div class="avatar"> ' +
									'				<img src="/Content/images/avatar.jpg"/>' +
									'			</div>' +
									'			<div class="content_comment">' +
									'				<div class="name">' +
									'					<span>Trần Lê Cường: </span>' +
									'				</div>' +
									'				<div class="show_comment">' +
									'					<p>' + n.contentComment +
                        '                       </p>' +
                                      '              </div>' +
                                       '         </div>' +
                                        '    </div>' +
                                         '   <!--end comment_item-->' +
                                          '  <div class="clear"></div>';

                    }
                }

                $("#showComment").html(html).show(500);
            }
        })
    }

    //add comment
    function addComment() {
        var userID = 1; // fix cung
        var contentComment = $("#txtComment").sceditor('instance').val();
        var postID = $("#idPost").val();

        var jsonData = [];
        var item = {};

        item["userID"] = userID;
        item["contentComment"] = contentComment;
        item["postID"] = postID;

        jsonData.push(item);
        jsonData = jsonData[0];

        $.ajax({
            type: "POST",
            url: "/Post/addComment",
            data: jsonData,
            dataType: "html",
            success: function () {
                showComment(postID);
                $("#txtComment").sceditor('instance').val('');
            }
        })
    }

    $(document).ready(function () {

        var postID = $("#idPost").val();

        showComment(postID);

        $("#btnComment").click(function () {
            addComment();
        });
    });
</script>
                                        <!--start item-->
										<div class="post_item">
											<div class="post_top">
												<div class="post_bottom">
                                                    <input id="idPost" type="hidden" value="@ViewBag.idPost" />
													<h2 class="entry_title">@ViewBag.titlePost</h2>
													<div class="post_infor">
														<a href="#">Trần Lê Cường</a>
														<a href="#">Viết lúc: @ViewBag.datePost</a>
													</div>
													<div class="entry_content">
														<div class="post_text">@Html.Raw(ViewBag.ContentPost)</div>
													</div>
												</div>
											</div>
										</div>
										<!--end item-->
										<!--start comment-->
										<div id ="comment">
											<h4>@ViewBag.countComment COMMENT</h4>
											<div class="bar"></div>
											<div id="showComment"></div>
                                        </div>
                                        <!--end comment-->
                                        <script>
                                            $(document).ready(function() {
	                                            var initEditor = function() {
		                                                $("textarea").sceditor({
			                                                    plugins: 'bbcode',
			                                                    toolbar: "bold,italic,underline|youtube,image,emoticon|link,quote|source",
			                                                    style: "./minified/jquery.sceditor.default.min.css"
                                                            });
                                                    };
                                                initEditor();
                                            });
                                        </script>
                                        <div class="text_comment">
                                            <textarea id="txtComment" style="width:524px; height:200px;" ></textarea>
                                        </div>
                                        <div id="submit_comment">
                                            <input type="button" id="btnComment" value="Gửi Bình Luận"/>
                                        </div>